<div style="margin: 2% 5%;">

  <div class="layui-form-item " >

    <div class="layui-inline" >
        <select name="groupStatus" style="width: 92px;height: 38px;" >
          <option value="图片" >图片</option>
          <option value="视频" >视频</option>
        </select>

    </div>
    <div class="layui-inline" >
      <button type="button" class="layui-btn"><i class="fa fa-folder" aria-hidden="true"></i>设置背景音乐</button>
    </div>

    <div class="layui-inline" >
      <button type="button" class="layui-btn"><i class="fa fa-folder" aria-hidden="true"></i>禁用背景音乐</button>
    </div>

    <div class="layui-inline" style="color: red;font-size: 5px;padding-left: 15%" >
      注：点击下面黑色左右边框上传视频;点击下面黑色边框内切换欢迎页图
    </div>

  </div>

  <div class="layui-form-item" id="test1" style="height: 450px;background:black;">
    <!--<div class="layui-upload-drag" id="test10" style="margin: 3%;height: 320px;width: 88%;">-->
      <!--<i class="layui-icon"></i>-->
      <!--<p>点击上传，或将文件拖拽到此处</p>-->
    <!--</div>-->

   <!-- <div class="layui-upload-drag" id="test10">
      <i class="layui-icon"></i>
      <p>点击上传，或将文件拖拽到此处</p>
    </div>-->


    <div class="layui-upload" style="margin: 3%;height: 320px;width: 88%;">
      <div class="layui-upload-list" >
        <img class="layui-upload-img" id="demo1">
        <p id="demoText"></p>
      </div>
    </div>

  </div>

</div>
<!--<script src="//res.layui.com/layui/dist/layui.js" charset="utf-8"></script>-->
<script>


  var local_store = layui.data("local_store");
  var local = local_store.token;
  $.ajax({
    type:"get",
    url:"/admin/station/query/stationLoginQuanxXian?stationId="+json.id,
    dataType: "json",
    contentType:"application/json;charset=utf-8",
    beforeSend: function(request) {
      request.setRequestHeader("token", local);
    },
    success:function (res) {
      if(res.code==500){
        alert("权限不足")
        location="../../admin/main.html";
        return
      }}})

  layui.use('upload', function(){
    var $ = layui.jquery
            ,upload = layui.upload;
  /*  //拖拽上传
    upload.render({
      elem: '#test10'
      ,url: '/uploadtupian'
      ,done: function(res){
        console.log(res)
      }
    });*/


    //普通图片上传
    var uploadInst = upload.render({
      elem: '#test1'
      ,url: '/upload/'
      ,before: function(obj){
        //预读本地文件示例，不支持ie8
        obj.preview(function(index, file, result){
          $('#demo1').attr('src', result); //图片链接（base64）
        });
      }
      ,done: function(res){
        //如果上传失败
        if(res.code > 0){
          return layer.msg('上传失败',{time: 1000});
        }
        //上传成功
      }
      ,error: function(){
        //演示失败状态，并实现重传
        var demoText = $('#demoText');
        demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-xs demo-reload">重试</a>');
        demoText.find('.demo-reload').on('click', function(){
          uploadInst.upload();
        });
      }
    });




  });
</script>